<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!--[if lte IE 9]><script>(function(f){window.setTimeout=f(window.setTimeout);window.setInterval=f(window.setInterval)})(function(f){return function(c,t){var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}});</script><![endif]-->
<!--[if IE 8]><script src="https://cdn.bootcss.com/ie8/0.8.0/ie8.js"></script><![endif]-->
<script src="https://cdn.bootcss.com/dom4/1.8.5/dom4.max.js"></script>
<!--[if IE 8]>
<script src="assets/js/dre-ie8-upfront-fix.max.js"></script>
<![endif]-->
<script src="https://cdn.bootcss.com/document-register-element/1.7.0/document-register-element.js"></script>
<!--[if IE 8]>
<script src="https://cdn.bootcss.com/es5-shim/4.5.10/es5-shim.js"></script>
<script src="https://cdn.bootcss.com/es5-shim/4.5.10/es5-sham.js"></script>
<![endif]-->

<script>
(function() {
  Object.defineProperty(HTMLInputElement.prototype, "auiValue", {
    get: function() {
      return this.value;
    },
    set: function(newval) {
      if (
          (this.hasAttribute("polyfill-input-type") && this.getAttribute("polyfill-input-type") === "number") || 
          this.type === "number"
      ) {
        if (!(/^-?(\d+|\d+\.\d+|\.\d+)([eE][-+]?\d+)?$/.test(newval))) {
            console.warn('The specified value " '+newval.toString()+' " is not a valid number. The value must match to the following regular expression: -?(\d+|\d+\.\d+|\.\d+)([eE][-+]?\d+)?');
            return;
        }
      }

      this.value = newval;
    }
  });
})(); 
</script>

<script>
    if (!window.Proxy) {
        var head = document.head || document.getElementsByTagName('head')[0];
        var script1 = document.createElement("script");
        script1.src = "https://cdn.bootcss.com/es6-shim/0.35.3/es6-shim.min.js";
        head.appendChild(script1);
    }

    if (!Object.entries) {
        Object.entries = function( obj ){
            var ownProps = Object.keys( obj ),
                i = ownProps.length,
                resArray = new Array(i); // preallocate the Array
            while (i--)
                resArray[i] = [ownProps[i], obj[ownProps[i]]];

            return resArray;
        };
    }
</script>
<script>
    ;(function(constructor) {
        // childElementCount
        if (constructor &&
            constructor.prototype &&
            constructor.prototype.childElementCount == null) {
            Object.defineProperty(constructor.prototype, 'childElementCount', {
                get: function() {
                    var i = 0, count = 0, node, nodes = this.childNodes;
                    while (node = nodes[i++]) {
                        if (node.nodeType === 1) count++;
                    }
                    return count;
                }
            });
        }

        // firstElementChild
        if (constructor &&
            constructor.prototype &&
            constructor.prototype.firstElementChild == null) {
            Object.defineProperty(constructor.prototype, 'firstElementChild', {
                get: function() {
                    var node, nodes = this.childNodes, i = 0;
                    while (node = nodes[i++]) {
                        if (node.nodeType === 1) {
                            return node;
                        }
                    }
                    return null;
                }
            });
        }

        // lastElementChild
        if (constructor &&
            constructor.prototype &&
            constructor.prototype.lastElementChild == null) {
            Object.defineProperty(constructor.prototype, 'lastElementChild', {
                get: function() {
                    var node, nodes = this.childNodes, i = nodes.length - 1;
                    while (node = nodes[i--]) {
                        if (node.nodeType === 1) {
                            return node;
                        }
                    }
                    return null;
                }
            });
        }
    })(window.Node || window.Element);
</script>
<script>
window.defineCustomElement = function (name, defines) {
    for (var key in defines) {
        if (defines[key] && {}.toString.call(defines[key]) === '[object Function]') {
            defines[key] = {value: defines[key]}
        }
    }
    document.registerElement(
        name,
        {
            prototype: Object.create(
                HTMLElement.prototype, defines
            )
        }
    );
};
</script>

    <link rel="stylesheet" href="../../ui.css?v=1415468471">
    <script src="../../ui.js?v=589342585"></script>

    <script src="../../../src/aux-text/index.js?v=1080149016"></script>
    <link rel="stylesheet" href="../../../src/aux-text/index.css?v=808449235">

    <style>
    </style>
    
    <link rel="stylesheet" href="./index.css?v=1882995055">
    <style>
        .auc-grid {
            width: 650px;
        }
        
        .auc-grid__inner {
            display: inline-block;
            margin-left: -10px;
        }

        .auc-item {
            width: 100px;
            height: 100px;
            margin-left: 10px;
            margin-bottom: 10px;
            background-color: #eee;
        }
    </style>

</head>
<body>

    <div>      
        <h3>默认</h3>   
        <div class="auc-grid"><div class="auc-grid__inner">
            
            <div class="auc-item"><div style="font-size: 14px">0 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">1 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">2 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">3 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">4 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">5 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">6 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">7 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">8 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">9 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">10 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">11 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">12 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">13 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">14 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">15 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">16 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">17 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">18 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">19 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">20 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">21 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">22 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">23 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">24 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">25 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">26 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">27 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">28 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">29 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">30 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">31 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">32 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">33 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">34 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">35 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">36 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">37 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">38 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">39 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">40 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">41 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">42 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">43 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">44 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">45 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">46 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">47 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">48 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">49 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">50 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">51 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">52 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">53 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">54 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">55 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">56 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">57 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">58 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">59 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">60 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">61 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">62 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">63 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">64 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">65 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">66 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">67 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">68 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">69 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">70 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">71 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">72 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">73 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">74 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">75 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">76 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">77 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">78 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">79 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">80 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">81 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">82 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">83 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">84 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">85 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">86 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">87 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">88 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">89 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">90 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">91 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">92 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">93 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">94 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">95 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">96 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">97 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">98 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">99 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">100 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">101 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">102 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">103 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">104 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">105 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">106 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">107 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">108 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">109 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">110 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">111 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">112 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">113 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">114 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">115 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">116 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">117 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">118 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">119 row</div></div>            
            
            <div class="auc-item"><div style="font-size: 14px">120 row</div></div>            
            
        </div></div>         
    </div>

</body>
</html>
